<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<meta name="generator" content="JsDoc Toolkit" />
		
		<title>JsDoc Reference - $</title>

		<style type="text/css">
			/* default.css */
body
{
	font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
	width: 800px;
}

.header
{
	clear: both;
	background-color: #ccc;
	padding: 8px;
}

h1
{
	font-size: 150%;
	font-weight: bold;
	padding: 0;
	margin: 1em 0 0 .3em;
}

hr
{
	border: none 0;
	border-top: 1px solid #7F8FB1;
	height: 1px;
}

pre.code
{
	display: block;
	padding: 8px;
	border: 1px dashed #ccc;
}

#index
{
	margin-top: 24px;
	float: left;
	width: 160px;
	position: absolute;
	left: 8px;
	background-color: #F3F3F3;
	padding: 8px;
}

#content
{
	margin-left: 190px;
	width: 600px;
}

.classList
{
	list-style-type: none;
	padding: 0;
	margin: 0 0 0 8px;
	font-family: arial, sans-serif;
	font-size: 1em;
	overflow: auto;
}

.classList li
{
	padding: 0;
	margin: 0 0 8px 0;
}

.summaryTable { width: 100%; }

h1.classTitle
{
	font-size:170%;
	line-height:130%;
}

h2 { font-size: 110%; }
caption, div.sectionTitle
{
	background-color: #7F8FB1;
	color: #fff;
	font-size:130%;
	text-align: left;
	padding: 2px 6px 2px 6px;
	border: 1px #7F8FB1 solid;
}

div.sectionTitle { margin-bottom: 8px; }
.summaryTable thead { display: none; }

.summaryTable td
{
	vertical-align: top;
	padding: 4px;
	border-bottom: 1px #7F8FB1 solid;
	border-right: 1px #7F8FB1 solid;
}

/*col#summaryAttributes {}*/
.summaryTable td.attributes
{
	border-left: 1px #7F8FB1 solid;
	width: 140px;
	text-align: right;
}

td.attributes, .fixedFont
{
	line-height: 15px;
	color: #002EBE;
	font-family: "Courier New",Courier,monospace;
	font-size: 13px;
}

.summaryTable td.nameDescription
{
	text-align: left;
	font-size: 13px;
	line-height: 15px;
}

.summaryTable td.nameDescription, .description
{
	line-height: 15px;
	padding: 4px;
	padding-left: 4px;
}

.summaryTable { margin-bottom: 8px; }

ul.inheritsList
{
	list-style: square;
	margin-left: 20px;
	padding-left: 0;
}

.detailList {
	margin-left: 20px; 
	line-height: 15px;
}
.detailList dt { margin-left: 20px; }

.detailList .heading
{
	font-weight: bold;
	padding-bottom: 6px;
	margin-left: 0;
}

.light, td.attributes, .light a:link, .light a:visited
{
	color: #777;
	font-style: italic;
}

.fineprint
{
	text-align: right;
	font-size: 10px;
}
		</style>
	</head>

	<body>
<!-- ============================== header ================================= -->	
		<!-- begin static/header.html -->
		<div id="header">
</div>
		<!-- end static/header.html -->

<!-- ============================== classes index ============================ -->
		<div id="index">
			<!-- begin publish.classesIndex -->
			<div align="center"><a href="../index.html">Class Index</a>
| <a href="../files.html">File Index</a></div>
<hr />
<h2>Classes</h2>
<ul class="classList">
	
	<li><a href="../symbols/%24.html">$</a></li>
	
	<li><a href="../symbols/%24.browser.html">$.browser</a></li>
	
	<li><a href="../symbols/%24.dom.html">$.dom</a></li>
	
	<li><a href="../symbols/%24.dom.DOMTokenList.html">$.dom.DOMTokenList</a></li>
	
	<li><a href="../symbols/%24.dom.Element.html">$.dom.Element</a></li>
	
	<li><a href="../symbols/%24.dom.HTMLElement.html">$.dom.HTMLElement</a></li>
	
	<li><a href="../symbols/%24.dom.KeyboardEvent.html">$.dom.KeyboardEvent</a></li>
	
	<li><a href="../symbols/%24.dom.KeyboardEventListener.html">$.dom.KeyboardEventListener</a></li>
	
	<li><a href="../symbols/%24.dom.keyCodes.html">$.dom.keyCodes</a></li>
	
	<li><a href="../symbols/%24.dom.keyCodes_fixes.html">$.dom.keyCodes_fixes</a></li>
	
	<li><a href="../symbols/%24.dom.keyCodes_Safari2.html">$.dom.keyCodes_Safari2</a></li>
	
	<li><a href="../symbols/%24.dom.keyNames.html">$.dom.keyNames</a></li>
	
	<li><a href="../symbols/%24.dom.Node.html">$.dom.Node</a></li>
	
	<li><a href="../symbols/%24.dom.NodeList.html">$.dom.NodeList</a></li>
	
	<li><a href="../symbols/%24.js.html">$.js</a></li>
	
	<li><a href="../symbols/%24.js.Array.html">$.js.Array</a></li>
	
	<li><a href="../symbols/%24.js.Object.html">$.js.Object</a></li>
	
	<li><a href="../symbols/%24.js.String.html">$.js.String</a></li>
	
	<li><a href="../symbols/%24.profiler.html">$.profiler</a></li>
	
	<li><i><a href="../symbols/_global_.html">_global_</a></i></li>
	
</ul>
<hr />
			<!-- end publish.classesIndex -->
		</div>
		
		<div id="content">
<!-- ============================== class title ============================ -->
			<h1 class="classTitle">
				
				Class $
			</h1>

<!-- ============================== class summary ========================== -->			
			<p class="description">
				
			
				The libmacrame namespace.
				
				
					<br /><i>Defined in: </i> <a href="../symbols/src/src_core.js.html">core.js</a>.
				
			</p>

<!-- ============================== constructor summary ==================== -->			
			
			<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class $.">
				<caption>Class Summary</caption>
				<thead>
					<tr>
						<th scope="col">Constructor Attributes</th>
						<th scope="col">Constructor Name and Description</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td class="attributes">&nbsp;</td>
						<td class="nameDescription" >
							<div class="fixedFont">
								<b><a href="../symbols/%24.html">$</a></b>(selector, context)
							</div>
							<div class="description">The $ symbol is simply an alias of <a href="../symbols/_global_.html#libmacrame">libmacrame</a>, for quicker access to 
the main namespace and main function, which is <a href="../symbols/%24.html#.init">$.init</a>.</div>
						</td>
					</tr>
				</tbody>
			</table>
			

<!-- ============================== properties summary ===================== -->
			
				
				
				
				
			

<!-- ============================== methods summary ======================== -->
			
				
				
				<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class $.">
					<caption>Method Summary</caption>
					<thead>
						<tr>
							<th scope="col">Method Attributes</th>
							<th scope="col">Method Name and Description</th>
						</tr>
					</thead>
					<tbody>
					
						<tr>
							<td class="attributes">&lt;static&gt; &nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont">$.<b><a href="../symbols/%24.html#.extend">extend</a></b>(overwrite, destination, source)
								</div>
								<div class="description">This function extends objects.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&lt;static&gt; &nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont">$.<b><a href="../symbols/%24.html#.init">init</a></b>(selector, context)
								</div>
								<div class="description">Find DOM elements.</div>
							</td>
						</tr>
					
					</tbody>
				</table>
				
				
				
			
<!-- ============================== events summary ======================== -->
			

<!-- ============================== constructor details ==================== -->		
			
			<div class="details"><a name="constructor"> </a>
				<div class="sectionTitle">
					Class Detail
				</div>
				
				<div class="fixedFont">
						<b>$</b>(selector, context)
				</div>
				
				<div class="description">
					The $ symbol is simply an alias of <a href="../symbols/_global_.html#libmacrame">libmacrame</a>, for quicker access to 
the main namespace and main function, which is <a href="../symbols/%24.html#.init">$.init</a>.
					
				</div>
				
				
				
				
					
						<dl class="detailList">
						<dt class="heading">Parameters:</dt>
						
							<dt>
								<span class="light fixedFont">{String}</span>  <b>selector</b>
								
							</dt>
								<dd></dd>
						
							<dt>
								<span class="light fixedFont">{Document|Element}</span>  <b>context</b>
								<i>Optional, Default: document</i>
							</dt>
								<dd></dd>
						
						</dl>
					
					
					
					
					
					
					
						<dl class="detailList">
						<dt class="heading">See:</dt>
						
							<dd><a href="../symbols/_global_.html#libmacrame">libmacrame</a></dd>
						
							<dd><a href="../symbols/%24.html#.init">$.init</a> This is the function called when you call $()</dd>
						
						</dl>
					

			</div>
			

<!-- ============================== field details ========================== -->		
			

<!-- ============================== method details ========================= -->		
			
				<div class="sectionTitle">
					Method Detail
				</div>
				
					<a name=".extend"> </a>
					<div class="fixedFont">&lt;static&gt; 
					
					
					<span class="light">$.</span><b>extend</b>(overwrite, destination, source)
					
					</div>
					<div class="description">
						This function extends objects.
						
						
					</div>
					
					
					
					<pre class="code"><code>var <var>obj1</var> = {a: 'a1', b: 'b1', d: 'd1'},
    <var>obj2</var> = {a: 'a2', b: 'b2', c: 'c2'};

$.extend(<var>obj1</var>, <var>obj2</var>);</code>

// Now <var>obj1.c == 'c2'</var>, while <var>obj1.a</var>, <var>obj1.b</var>
// and <var>obj1.d</var> remain the same.

// If <code>$.extend(true, <var>obj1</var>, <var>obj2</var>)</code> is
// called, then <var>obj1.a</var>, <var>obj1.b</var>, <var>obj1.c</var>
// become all the same as in <var>obj2</var>.</pre>
					
					<pre class="code"><code>var <var>obj1</var> = {a: 'a1', b: 'b1', extend: $.extend};
<var>obj1</var>.extend({c: 'c1', d: 'd1'});</code>

// In this case the destination object which is to be extend is
// <var>obj1</var>.</pre>
					
					
					
						
							<dl class="detailList">
							<dt class="heading">Parameters:</dt>
							
								<dt>
									<span class="light fixedFont">{Boolean}</span> <b>overwrite</b>
									<i>Optional, Default: false</i>
								</dt>
								<dd>If the first argument is a boolean, then 
it will be considered as a boolean flag for overwriting (or not) any existing 
methods and properties in the destination object. Thus, any method and 
property from the source object will take over those in the destination. The 
argument is optional, and if it's omitted, then no method/property will be 
overwritten.</dd>
							
								<dt>
									<span class="light fixedFont">{Object}</span> <b>destination</b>
									<i>Optional, Default: this</i>
								</dt>
								<dd>The second argument is the optional 
destination object: the object which will be extended. By default, the 
<var>this</var> object will be extended.</dd>
							
								<dt>
									<span class="light fixedFont">{Object}</span> <b>source</b>
									
								</dt>
								<dd>The third argument must provide list of methods and 
properties which will be added to the destination object.</dd>
							
							</dl>
						
						
						
						
						
						
						

					<hr />
				
					<a name=".init"> </a>
					<div class="fixedFont">&lt;static&gt; 
					
					<span class="light">{Element|NodeList}</span>
					<span class="light">$.</span><b>init</b>(selector, context)
					
					</div>
					<div class="description">
						Find DOM elements.

<p>This function currently allows you to use CSS selectors to find the DOM 
elements you want.

<p>TODO: This is not done yet.
						
						
					</div>
					
					
					
					<pre class="code">// Find the element with id='foo':

<code>$('#foo');</code></pre>
					
					<pre class="code">// Find the elements having a class token 'foo':

<code>$('.foo');</code></pre>
					
					<pre class="code">// Find all the <code>&lt;span&gt;</code> elements which are direct child
// children of <code>&lt;p&gt;</code> elements:

<code>$('p &gt; span');</code></pre>
					
					
					
						
							<dl class="detailList">
							<dt class="heading">Parameters:</dt>
							
								<dt>
									<span class="light fixedFont">{String}</span> <b>selector</b>
									
								</dt>
								<dd>The CSS selector. You can also use multiple 
selectors, separated by comma. Basically, you can use anything supported by 
querySelectorAll().</dd>
							
								<dt>
									<span class="light fixedFont">{Document|Element}</span> <b>context</b>
									<i>Optional, Default: document</i>
								</dt>
								<dd>The context where the CSS 
selector will be used for finding the matching elements.</dd>
							
							</dl>
						
						
						
						
						
							<dl class="detailList">
							<dt class="heading">Returns:</dt>
							
								<dd><span class="light fixedFont">{Element|NodeList}</span> The element found, or the list of elements 
matching the selector.</dd>
							
							</dl>
						
						
							<dl class="detailList">
							<dt class="heading">Requires:</dt>
							
								<dd>A Web browser which implements <a 
href="http://www.w3.org/TR/selectors-api/">Selectors API</a>. Currently this 
means <a href="http://opera.com">Opera</a> 10+, <a 
href="http://mozilla.com">Firefox</a> 3.1+ and <a 
href="http://apple.com/safari">Safari</a> 4+.</dd>
							
							</dl>
						
						

					
				
			
			
<!-- ============================== event details ========================= -->		
			
			
			<hr />
		</div>

		
<!-- ============================== footer ================================= -->
		<div class="fineprint" style="clear:both">
			
			Documentation generated by <a href="http://www.jsdoctoolkit.org/" target="_blank">JsDoc Toolkit</a> 2.1.0 on Mon May 11 2009 19:36:21 GMT+0300 (EEST)
		</div>
	</body>
</html>
